$(function () {
  initArtCateList()
  function initArtCateList() {
    axios.get('/my/article/cates').then((res) => {
      // console.log(res);
      if (res.data.status !== 0) {
        return layer.msg(res.data.message);
      }
      let arr = []
      res.data.data.forEach(element => {
        arr.push(`
        <tr>
            <td>${element.Id}</td>
            <td>${element.name}</td>
            <td>${element.alias}</td>
            <td>
              <button type="button" class="alter layui-btn layui-btn-xs" data-id="${element.Id}">修改</button>
              <button type="button" class="del layui-btn layui-btn-xs layui-btn-danger" data-id="${element.Id}">删除</button>
            </td>
          </tr>
        `)
      })
      $('tbody').html(arr.join(''))
    })
  }
  //弹框
  let indexAdd = 0
  $('#addBtn').on('click',function(){
    indexAdd=layer.open({
      type:1,
      title: '推荐文章分类',
      area: ['500px', '260px'],
      content: `
      <form id="addForm" class="layui-form" action="">
        <div class="layui-form-item">
          <label class="layui-form-label">分类名称</label>
        <div class="layui-input-block">
          <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
        </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">分类别名</label>
        <div class="layui-input-block">
          <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
        </div>
        </div>
        <div class="layui-form-item">
          
        <div class="layui-input-block">
        <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
        </div>
      </form>`
    });     
  })
  $('body').on('submit', '#addForm', function (e) {
    e.preventDefault()
    axios.post('/my/article/addcates', $(this).serialize()
    ).then((res) => {
      // console.log(res);
      layer.close(indexAdd)
      initArtCateList()
    })
  })
  //弹出修改
  let idoneAdd=0
  let idone=0
  $('body').on('click', '.alter', function () {
    idone=$(this).attr('data-id')
    idoneAdd=layer.open({
      type:1,
      title: '修改文章分类',
      area: ['500px', '260px'],
      content: `
      <form id="alterForm" lay-filter="formTest" class="layui-form" >
      <input  hidden type="text" name="Id" >
        <div class="layui-form-item">
          <label class="layui-form-label">分类名称</label>
        <div class="layui-input-block">
          <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
        </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">分类别名</label>
        <div class="layui-input-block">
          <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
        </div>
        </div>
        <div class="layui-form-item">
          
        <div class="layui-input-block">
        <button id="alterBtn" class="layui-btn" lay-submit lay-filter="formDemo">确认修改</button>
        </div>
        </div>
      </form>`
    });   
    axios.get(`/my/article/cates/${idone}`).then(res => {
      console.log(res);
      layui.form.val("formTest",res.data.data)
    })
  })
  //修改
  $('body').on('click', '#alterBtn', function (e) {
    e.preventDefault()
    
    $('[name="Id"]').val(idone)
    axios.post('/my/article/updatecate',$('#alterForm').serialize()
    ).then((res) => {
      if (res.data.status !== 0) {
        return layer.msg(res.data.message)
      }
      console.log(res);
      layer.close(idoneAdd)
      layer.msg('恭喜你,修改成功')
      initArtCateList()
    })
  })
  //删除
  $('body').on('click', '.del', function () {
    let id=$(this).attr('data-id')
    layer.confirm('确认删除吗', {icon: 3, title:'提示'}, function(index){
      //do something
      axios({
        url:`/my/article/deletecate/${id}`,
        method:'get',
      }).then(res=>{
        //成功回调
        if (res.data.status !== 0) {
          return layer.msg(res.data.message)
        }
        layer.msg('恭喜你,删除成功')
        console.log(res)
        initArtCateList()
      });
      
      layer.close(index);
    });
    // let dd=JSON.stringify({
    //   id:$(this).attr('data-id')
    // })
    // console.log(dd);
    
    
    
    
   })
  }
)